<template>
  <header class="header">
    <div class="h-l"><span @click="prev"> ＜ </span></div>
    <div class="h-c">猫眼电影</div>
    <div class="h-r"></div>
  </header>
</template>

<script>
export default {
  name: "MyHeader4",
  data() {
    return {};
  },
  methods: {
    prev() {
      this.$router.go(-1);
    },
  },
};
</script>

<style lang="less" scoped>
.header {
  width: 100%;
  height: 1.3333rem;
  line-height: 1.3333rem;
  background: #e54847;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
  .h-l {
    span {
      font-size: 30px;
      color: #fff;
    }
  }
  .h-l,
  .h-r {
    width: 20%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    img {
      width: 0.4267rem;
      height: 0.4533rem;
    }
  }
  .h-c {
    width: 60%;
    font-size: 0.48rem;
    color: #fff;
    text-align: center;
  }
}
</style>